<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Personal website - wushuxuan</title>
    <!-- 包含头部信息用于适应不同设备 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" id="pageloader-css"  href="include/css/pageloader.css"
          type="text/css" media="all" />
    <link rel="stylesheet" href="include/font-awesome-4.7.0/css/font-awesome.min.css"/>
    <!--包含了 jquery.js、bootstrap.min.js 和 bootstrap.min.css 文件，用于让一个常规的 HTML 文件变为使用了 Bootstrap 的模板-->
    <link rel="stylesheet" href="include/bootstrap-3.3.7-dist/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="include/css/style.css"/>
    <link rel="stylesheet" href="include/css/bootstrap.css"/>
    <link rel="icon" href="include/image/icon1.ico"/>
    <script src="include/js/jquery-1.9.1.min.js"></script>
    <script src="include/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
    <script src="include/js/scroll.js"></script>
    <script src="include/js/waterFall.js"></script>
    <script src="include/js/image.js"></script>
</head>
<body>
<!--网页主要内容-->
    <div id="head">
        <div id="head_nav">
            <div id="head_nav_html01">
                <h1 style="padding:0 1% 0 1%;"><span>Wushuxuan&nbsp;</span><span>Personalwebsite</span></h1>
                <p><span class="fa fa-map-marker"></span><span>&nbsp;湖南人文科技学院</span></p>
            </div>
            <div id="head_nav_html02">
                <nav>
                    <a class="on" href="javascript:;">Home</a>
                    <a href="javascript:;">个人介绍</a>
                    <a href="javascript:;">前端技能/后台语言</a>
                    <a href="javascript:;">部分PS/AI图片展示</a>
                    <a href="javascript:;">联系方式</a>
                </nav>
            </div>
        </div>
        <div id="div_lunbo" style="width:200%;">
            <a id="prev" href="javascript:;" class="callbacks_nav callbacks1_nav prev"></a>
            <a id="next" href="javascript:;" class="callbacks_nav callbacks1_nav next"></a>
            <div id="head_contain" style="left:0%;">
                <div class="left">
					 <p>熟悉数据库开发mysql，Oracel等数据库；</p>
					 <p>熟练使用MyEclipse等开发工具编写java后端代码；</p>
					 <p>熟悉HTML和CSS布局,遵循W3C规范,能自主编写有语义化,模块化的	页	面代码；</p>
					 <p>熟练使用Javascript,jQuery,实现各种交互效果；</p>
					 <p>熟练使用Webstorm,Dreamweaver等前端开发工具；</p>
					 <p>熟练使用Bootstrap等常见框架；</p>
					 <p>熟练使用Ps和Ai等做图工具；</p>
                </div>
                <div class="right">
                    <div>
                        <p>意向职位 : Web前端开发</p>

                        <p>教育经历 : 湖南人文科技学院 - 软件工程 - 本科 </p>

                        <p>QQ : 844701878 </p>

                        <p>电话 : 15581221907</p>
						
						<p>喜欢钻研做各种网页特效 </p>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div id="container">
        <div class="sections">


            <div class="section">
                <h1 class="text-center">HELLO WORLD</h1>
                <hr/>
                <section id="section_first" class="col-xs-12 col-lg-6">
                    <p><strong>THIS IS ME , A DIFFERENT COLOR OF FIREWORKS</strong></p><br/>
                    <p> 【 前端实践经历 】</p><br/>
                    <p>&nbsp;&nbsp;<strong>2016.12		鲜花速递网站		主要完成网站的前端页面</strong></p><br/>
                  <p> ●  我在这个项目中主要担任网站前端工程师的工作，使用java代码完成前后端交互；</p><br/>
					<p>●  软件环境 ： Html、DIV+CSS、JS、jQuery、Ajax、servlet、mysql、tomcat和bootstrap</p><br/>
					<p>●  开发工具 ： MyEclipse ， WebStorm</p><br/>
					<p>●  责任描述 ： 网站页面设计布局与美化，图片轮播等各种js特效，用户注册登录模块，用户管理模块等；</p><br/>
					<p>●	在这个项目前端中我完成了：</p><br/>
					<p>1 : 分析页面的布局，使用html5和css3和bootstrap完成网站页面结构及其内容；</p><br/>
					<p>2 : 使用原生写js和jquery完成图片轮播，网页下滑菜单栏等网站动态效果，使网站更加吸引用户眼球同时改善用户的体验效果；</p><br/>
					<p>3 : 设计数据库结构并使用heidisql完成网站数据库内容；</p><br/>
					<p>4 : 使用MyEclipse编写java代码完成前后端交互效果，用户注册，登陆，管理等；</p><br/>
					<p>5 : 使用WebStorm编写前端代码；</p><br/>
                    <p>●	自学Bootstrap框架并用较短的时间内使用webstorm完成了一个鲜花速递网站的前端页面；</p><br/><br/><br/>
                    <p><strong><a href="javascript:;">MORE</a></strong></p>
                </section>
                <section id="section_second" class="col-xs-12 col-lg-6">
                    <p><strong>MY HOBBY</strong></p>
                    <div id="section_second_img">
                        <div><img src="include/image/favorite1.jpg"/></div>
                        <div><img src="include/image/favorite3.jpg"/></div>
                        <div><img src="include/image/favorite2.jpg"/></div>
                    </div>
                    <div id="contain">
                        <div class="panel-group" id="accordion">
                            <div class="panel panel-default">
                                <div class="panel-heading">
                                    <h4 class="panel-title">
                                        <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
                                            <span class="glyphicon glyphicon-plus"></span>&nbsp;自我评价
                                        </a>
                                    </h4>
                                </div>
                                <div id="collapseOne" class="panel-collapse collapse in">
                                    <div class="panel-body">
                                        <p>1：自学能力强，有较强的适应能力 ； </p><br/>
										<p>2：有良好的沟通能力，具有很强的团队协作意识  ；</p><br/>
 										<p>3：工作主动，责任心、执行力及抗压性强，能够积极的面对并解决工作中的问题 ；</p><br/>
										<p>4：具有较强的文档撰写能力，具备独立分析和解决问题的能力， 工作认真、 踏实，责任心和进取心强，较强的协作精神和团队意识；</p><br/>
                                    </div>
                                </div>
                            </div>

                            <div class="panel panel-default">
                                <div class="panel-heading">
                                    <h4 class="panel-title">
                                        <a data-toggle="collapse" data-parent="#accordion"
                                           href="#collapseTwo">
                                            <span class="glyphicon glyphicon-plus"></span>&nbsp; 技能证书
                                        </a>
                                    </h4>
                                </div>
                                <div id="collapseTwo" class="panel-collapse collapse">
                                    <div class="panel-body">
                                        大学英语四级<br/><br/>

                                        计算机二级<br/><br/>

                                        普通话二甲
                                    </div>
                                </div>
                            </div>
                            <div class="panel panel-default">
                                <div class="panel-heading">
                                    <h4 class="panel-title">
                                        <a data-toggle="collapse" data-parent="#accordion"
                                           href="#collapseThree">
                                            <span class="glyphicon glyphicon-plus"></span>&nbsp;掌握技能
                                        </a>
                                    </h4>
                                </div>
                                <div id="collapseThree" class="panel-collapse collapse">
                                    <div class="panel-body">
                                       <p>熟悉HTML和CSS布局,遵循W3C规范,编写有语义化,模块化的页面代码;</p>
                                        <p>熟悉Javascript,jQuery,实现日常交互效果;</p>
                                        <p>熟练使用Webstorm,Dreamweaver等前端开发工具;</p>
                                        <p>了解熟练使用Bootstrap等常见框架;</p>
                                        <p>熟悉使用Ps和Ai等做图工具。</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </section>
            </div>



            <div class="section">
                <div id="section4_div">
                    <p class="text-center">I&nbsp;&nbsp;can do</p>
                    <hr/>
                    <div class="col-lg-3 col-sm-3">
                        <figure>
                            <div>
                                <span class="fa fa-code"></span>
                            </div>
                            <figcaption><strong>C语言/java - 数据库mysql/oracle</strong></figcaption>
                        </figure>
                    </div>
                    <div class="col-lg-3 col-sm-3">
                        <figure>
                            <div>
                                <span class="fa fa-paint-brush"></span>
                            </div>
                            <figcaption><strong>html/html5 - css/css3</strong></figcaption>
                        </figure>
                    </div>
                    <div class="col-lg-3 col-sm-3">
                        <figure>
                            <div>
                                <span class="fa fa-connectdevelop"></span>
                            </div>
                            <figcaption><strong>Js/Juqery</strong></figcaption>
                        </figure>
                    </div>
                    <div class="col-lg-3 col-sm-3">
                        <figure>
                            <div>
                                <span class="fa fa-star"></span>
                            </div>
                            <figcaption><strong>Bootstrap</strong></figcaption>
                        </figure>
                    </div>
                </div>
            </div>


            <div class="section">
                <section>
                    <h1 class="text-center">部分PS/AI图片展示</h1>
                    <hr/>
                    <nav class="text-center">
                        <a href="javascript:;" >这是一小部分使用PS,AI做成的图片</a>
                    </nav>
                    <section>
                        <div id="main">
                            <div class="box" title="三生三世十里桃花 - ps制作">
                                <div class="pic">
                                    <img src="include/image/02.jpg">
                                </div>
                            </div>
                            <div class="box" title="黑色毛衣 - ps制作">
                                <div class="pic">
                                    <img src="include/image/01.jpg">
                                </div>
                            </div>
                            <div class="box" title="好喜欢字体 - ps制作">
                                <div class="pic">
                                    <img src="include/image/03.jpg">
                                </div>
                            </div>
                            <div class="box" title="三生三世十里桃花 - ps制作">
                                <div class="pic">
                                    <img src="include/image/04.gif">
                                </div>
                            </div>
                            <div class="box" title="三生三世十里桃花 - ps制作">
                                <div class="pic">
                                    <img src="include/image/06.jpg">
                                </div>
                            </div>
                            <div class="box" title="三生三世十里桃花 - ps制作">
                                <div class="pic">
                                    <img src="include/image/05.jpg">
                                </div>
                            </div>
                            <div class="box" title="三生三世十里桃花 - ps制作">
                                <div class="pic">
                                    <img src="include/image/背景.jpg">
                                </div>
                            </div>
                            <div class="box" title="三生三世十里桃花 - ps制作">
                                <div class="pic">
                                    <img src="include/image/鬼道门.jpg">
                                </div>
                            </div>
                            <div class="box" title="三生三世十里桃花 - ps制作">
                                <div class="pic">
                                    <img src="include/image/08.jpg">
                                </div>
                            </div>
                        </div>
                    </section>
                </section>
            </div>

            <div class="section">
                <section>
                    <div class="col-md-4">
                        <h3 class="text-center">姓名 :</h3>
                        <hr/>
                        <p class="text-center"><span class="fa fa-user fa-2x"></span>&nbsp;&nbsp;&nbsp;&nbsp;吴姝璇</p>
                    </div>
                    <div class="col-md-4">
                        <h3 class="text-center">手机号码 :</h3>
                        <hr/>
                        <p class="text-center"><span class="fa fa-phone fa-2x"></span>&nbsp;&nbsp;&nbsp;&nbsp; 15581221907</p>
                    </div>
                    <div class="col-md-4">
                        <h3 class="text-center">电子邮箱 :</h3>
                        <hr/>
                        <p class="text-center"><span class="fa fa-envelope-open fa-2x"></span>&nbsp;&nbsp;&nbsp;&nbsp; 844701878@qq.com</p>
                    </div>
                </section>
                <div>
                    <p class="text-center">Copyright © wushuxuan | 采用 BootStrap 框架</p>
                </div>
            </div>
        </div>
    </div>
    <div id="scrolltotop"></div>
</body>
</html>